{include file="common/header"}
	<link rel="stylesheet" href="$meet/static/maps/css/style_dianping.css">
	<link rel="stylesheet" href="$meet/static/maps/css/global_2.css">
    <script src="$meet/static/maps/js/jquery-1.10.2.min_2.js" type="text/javascript"></script>

     <link rel="stylesheet" href="$meet/static/bootstrap2.3.2/css/bootstrap.min.css">  
     <script src="http://cdn.static.runoob.com/libs/jquery/2.1.1/jquery.min.js"></script>
 	 <script src="$meet/static/bootstrap2.3.2/js/bootstrap.min.js"></script>
  	 <script src="$meet/static/bootstrap2.3.2/js/jquery-1.9.1.min.js"></script>

	<div class="navbar-fixed">
	<div class="main-nav">
		<div class="navbar-wrap">
			<div class="m-topMenu">
				<div class="slider-wrap">
					<div class="m-navItems">
						<div class="item-cell selected">
							  <div class="btn-group">
							      <a class="btn dropdown-toggle" data-toggle="dropdown" >
							        冬奥赛区
							        <span class="caret"></span>
							      </a>
							      <ul class="dropdown-menu">
							        <li><a href="$meet/index.php/index/Map/partition">北京赛区</a></li>
							        <li role="separator" class="divider"></li>
							        <li><a href="$meet/index.php/index/Map/zhang_zone">张家口赛区</a></li>
							        <li role="separator" class="divider"></li>
							        <li><a href="$meet/index.php/index/Map/yanqing_zone">延庆赛区</a></li>
							      </ul>
							    </div>
						</div>
						<div class="item-cell ">
							<!-- <a href="$meet/index.php/index/Map/sking?class=1">滑雪推荐</a> -->
                            <div class="btn-group">
                                  <a class="btn dropdown-toggle" data-toggle="dropdown" >
                                    滑雪推荐
                                    <span class="caret"></span>
                                  </a>
                                  <ul class="dropdown-menu">
                                    <li><a href="$meet/index.php/index/Map/sking?class=1">北京</a></li>
                                    <li role="separator" class="divider"></li>
                                    <li><a href="$meet/index.php/index/Map/sking?class=3">张家口</a></li>
                                    <li role="separator" class="divider"></li>
                                    <li><a href="$meet/index.php/index/Map/sking?class=2">延庆</a></li>
                                  </ul>
                                </div>
						</div>
<!-- 						<div class="item-cell">
							<a href="$meet/index.php/index/Map/snack" >小吃推荐</a>
						</div> -->
					</div>
				</div>
				<!-- <a class="category-menu" href="http://m.8264.com/nav"></a> -->
			</div>
		</div>
	</div>
</div>
<script type="text/javascript">
	$(document).ready(function () {
		$(".category-menu").on('click', function () {
			$(this).hasClass("expanded") ? $(this).removeClass("expanded") : $(this).addClass("expanded")
		})
		
		var d = $(".m-navItems"),
		u = d.find("div.selected");
		u.index() > 3 ? d.parent()[0].scrollLeft=u[0].offsetLeft-u.width()/2 : "";
	});
</script>    	
<div class="indexbox">
	 {volist name="list->data" id="vo"} 
		<div class="nav{$vo.id}">
	      <a   data-toggle="modal" data-target="#{$vo.id}" id="">
		        <img src="$meet/static/maps/picture/{$vo.image}" alt="{$vo.name}">
		         <p  class="titles" >{$vo.name}</p>
	        </a>
	        <!-- 模态框（Modal） -->
				<div class="modal fade" id="{$vo.id}" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
					<div class="modal-dialog">
						<div class="modal-content">
							<div class="modal-header">
								<button type="button" class="close" data-dismiss="modal" aria-hidden="true">
									&times;
								</button>
								<h4 class="modal-title" id="myModalLabel">
									{$vo.name}
								</h4>
							</div>
							<div class="modal-body">
							<p>日常营业时间：{$vo.bus_hour}</p>
							<p>比赛项目：{$vo.project}</p>
							<p>具体介绍：{$vo.content}</p>
							</div>
							<div class="modal-footer">
								<a href="$meet/index.php/index/Map/map?id={$vo.id}"><button type="button" class="btn btn-primary" >
									去这里
								</button></a>
							</div>
						</div><!-- /.modal-content -->
					</div><!-- /.modal -->
				</div>
        	<!--结束-->
		</div>
		{/volist} 
</div><br/><br/>
	<script>
	// $(document).ready(function(){
 //        $('#myModal').modal('show');
 //    })
        var mouseStartPoint = {"left":0,"top":  0};  
        var mouseEndPoint = {"left":0,"top":  0};  
        var mouseDragDown = false;  
        var oldP = {"left":0,"top":  0};  
        var moveTartet ;  
        $(document).ready(function(){  
            $(document).on("mousedown","#myModaldialog",function(e){  
                if($(e.target).hasClass("close"))//点关闭按钮不能移动对话框  
                    return;  
                $(".modal").css("overflow", "hidden");//禁止模态对话框的半透明背景滚动
                mouseDragDown = true;  
                moveTartet = $(this).parent();  
                mouseStartPoint = {"left":e.clientX,"top":  e.clientY};  
                oldP = moveTartet.offset(); 
            $(document).on("mouseup",function(e){  
                mouseDragDown = false;  
                moveTartet = undefined;  
                mouseStartPoint = {"left":0,"top":  0};  
                oldP = {"left":0,"top":  0}; 
            });   
            });  
            $(document).on("mousemove",function(e){  
                if(!mouseDragDown || moveTartet == undefined)return;  
                var mousX = e.clientX;  
                var mousY = e.clientY;  
                if(mousX < 0)mousX = 0;  
                if(mousY < 0)mousY = 25;  
                mouseEndPoint = {"left":mousX,"top": mousY};  
                var width = moveTartet.width();  
                var height = moveTartet.height();  
                mouseEndPoint.left = mouseEndPoint.left - (mouseStartPoint.left - oldP.left);//移动修正，更平滑  
                mouseEndPoint.top = mouseEndPoint.top - (mouseStartPoint.top - oldP.top);  
                moveTartet.offset(mouseEndPoint);
            });  
        }); 
       // for(i in document.images)
         //   document.images[i].ondragstart= false;
</script>

